<template>
  <a-form-model layout="inline" :model="formInline" @submit="handleSubmit" @submit.native.prevent>

      <!-- 用户 -->
    <a-form-model-item>
      <a-input v-model="formInline.user" placeholder="用户">
        <a-icon slot="prefix" type="user" style="color:rgba(0,0,0,.25)" />
      </a-input>
    </a-form-model-item><br>

    <!-- 密码 -->
    <a-form-model-item>
      <a-input v-model="formInline.password" type="password" placeholder="密码">
        <a-icon slot="prefix" type="lock" style="color:rgba(0,0,0,.25)" />
      </a-input>
    </a-form-model-item><br>

    <!-- 确认密码 -->
    <a-form-model-item>
      <a-input v-model="formInline.password1" type="password" placeholder="确认密码">
        <a-icon slot="prefix" type="lock" style="color:rgba(0,0,0,.25)" />
      </a-input>
    </a-form-model-item><br>

    <!-- 邮箱 -->
    <a-form-model-item>
      <a-input v-model="formInline.email" type="text" placeholder="邮箱">
        <a-icon slot="prefix" type="frown" style="color:rgba(0,0,0,.25)" />
      </a-input>
    </a-form-model-item><br>

    <!-- 手机号 -->
    <a-form-model-item>
      <a-input v-model="formInline.phone" type="text" placeholder="手机号">
        <a-icon slot="prefix" type="phone" style="color:rgba(0,0,0,.25)" />
      </a-input>
    </a-form-model-item><br>

    <!-- 图片 -->
    <img
        class="verify-code"
        :src="imgUrl"
        @click="getIdentifyingCode"
    ><br>

    <a-form-model-item>
      <a-input v-model="kaka" placeholder="输入图片验证码">
        <a-icon slot="prefix" type="smile" style="color:rgba(0,0,0,.25)" />
      </a-input>
    </a-form-model-item><br>

    <a-form-model-item>
      <a-input v-model="formInline.code" type="text" placeholder="请输入短信验证码">
        <a-icon slot="prefix" type="smile" style="color:rgba(0,0,0,.25)" />
      </a-input>
    </a-form-model-item><br>

    

    <a-form-model-item>
        <a-button @click="sendcode">
        发送短信
        
      </a-button>
    </a-form-model-item>
    <a-button
        type="primary"
        block
        html-type="submit"
        :disabled="formInline.user === '' || formInline.password === ''"
    >
      注册
    </a-button>
  </a-form-model>



</template>
<script>
export default {
    props: ['imgUrl', 'uuid'],
    
    data() {
        return {
            formInline: {
                user: '',
                password: '',
                password1: '',
                email: '',
                phone:'',
                code: ''
            },
            kaka: ''
            
            
        };
    },
    methods: {
        handleSubmit(e) {
        console.log(this.formInline);
        },
        handleSubmit:function(){
        this.$emit('form', this.formInline)
        },
        getIdentifyingCode:function(){
            this.$emit('uuid', this.formInline)
        },
        sendcode: function(){
            this.$emit('phone', {'phone':this.formInline.phone,  'image_code':this.kaka, 'image_code_uuid': this.uuid})
        }

         
    },
    mounted(){
        console.log(this.imgUrl)
    }
};
</script>
